<template>
    <div>
        <el-table
                :data="building"
                style="width: 100%">
            <el-table-column
                    label="楼名"
                    width="180">
                <template slot-scope="scope">
                    <div slot="reference" class="name-wrapper">
                        <el-tag size="medium">{{ scope.row.buildingName }}</el-tag>
                    </div>
                </template>
            </el-table-column>
            <el-table-column
                    label="楼号"
                    width="180">
                <template slot-scope="scope">
                    <div slot="reference" class="name-wrapper">
                        <el-tag size="medium">{{ scope.row.buildingNumber }}</el-tag>
                    </div>
                </template>
            </el-table-column>
            <el-table-column
                    label="面积"
                    width="180">
                <template slot-scope="scope">
                    <div slot="reference" class="name-wrapper">
                        <el-tag size="medium">{{ scope.row.buildingArea }}</el-tag>
                    </div>
                </template>
            </el-table-column>
            <el-table-column
                    label="位置"
                    width="180">
                <template slot-scope="scope">
                    <div slot="reference" class="name-wrapper">
                        <el-tag size="medium">{{ scope.row.buildingLocation }}</el-tag>
                    </div>
                </template>
            </el-table-column>
            <el-table-column
                    label="建成年份"
                    width="180">
                <template slot-scope="scope">
                    <div slot="reference" class="name-wrapper">
                        <el-tag size="medium">{{ scope.row.buildingYear }}</el-tag>
                    </div>
                </template>
            </el-table-column>
            <el-table-column
                    label="楼层数"
                    width="180">
                <template slot-scope="scope">
                    <div slot="reference" class="name-wrapper">
                        <el-tag size="medium">{{ scope.row.floorsNumber }}</el-tag>
                    </div>
                </template>
            </el-table-column>
            <el-table-column
                    label="住户数量"
                    width="180">
                <template slot-scope="scope">
                    <div slot="reference" class="name-wrapper">
                        <el-tag size="medium">{{ scope.row.dwllingNumber }}</el-tag>
                    </div>
                </template>
            </el-table-column>
            <el-table-column
                    label="楼长"
                    width="180">
                <template slot-scope="scope">
                    <!--                    <div slot="reference" class="name-wrapper">-->
                    <!--                        <el-tag size="medium">{{ scope.row.resident.name }}</el-tag>-->
                    <!--                    </div>-->
                </template>
            </el-table-column>

            <el-table-column label="操作">
                <template slot-scope="scope">
                    <!--                <el-button-->
                    <!--                        size="mini"-->
                    <!--                        @click="handleEdit(scope.$index, scope.row)">编辑</el-button>-->
                    <router-link :to="{name:'adminadd',query:{id:scope.row.id}}">  <el-button size="mini">编辑</el-button></router-link>
                    <el-button
                            size="mini"
                            type="danger"
                            v-if="scope.row.state"
                            @click="handleDelete(scope.row.id, scope.row)">禁用
                    </el-button>
                    <el-button
                            size="mini"
                            type="success"
                            v-else
                            @click="handleDelete(scope.row.id, scope.row)">启用
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page.sync="currentPage1"
                :page-size="pageSize"
                layout="total, prev, pager, next"
                :total="total">
        </el-pagination>

    </div>
</template>

<script>
export default {
    data() {
        return {
            building:[],
            total:'',
            pageSize:''
        }
    },
    created() {
        this.handleBuilding();
    },
    methods: {
        onSubmit() {
            console.log('submit!');
        },
        handleBuilding(){
            this.$axios.get("manage/buildingPageList",{params: {pageNum:"1",pageSize:"5"}})
                .then(res=>{
                    console.log(res.data)
                    this.building=res.data.buildingPage.records
                    this.total=res.data.buildingPage.total
                    this.pageSize=res.data.buildingPage.size
                })

        },//编辑
        handleEdit(index, row) {
            console.log(index, row);
        },//删除
        handleDelete(index, row) {
            this.$axios.post("manage/deleteAdmin",row).then(res=>{
                alert(res.data.msg);
                this.handleAdmin();
            })
            console.log(index, row);
        },
        handleCurrentChange(val) {
            this.$axios.get("manage/adminpagelist",{params: {pageNum:val,pageSize:this.pageSize}})
                .then(res=>{
                    this.admin=res.data.adminPage.records
                })
        }

    }
}
</script>

<style scoped>

</style>